<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
Created by GaoXiang
Date: 2018-09-27 11:55:37 星期四
Version: 1.0
收费规则添加页面
--%>

<div class="portlet light">

    <div class="portlet-body form">
        <!-- BEGIN FORM-->
        <form action="#" class="form-horizontal" id="save-module">
            <div class="form-body">

                <div class="row">
                    <div class="col-md-6 hide">
                        <div class="form-group">
                            <label class="control-label col-md-3">ID</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="id" value="${longId}" placeholder="默认生成，ID">
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">规则名称</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" required name="name" placeholder="规则名称">
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">收费方式</label>
                            <div class="col-md-9">
                                <%--<input type="text" class="form-control" required name="buyType" placeholder="buyType">--%>
                                <select class="form-control" name="buyType" onchange="chooseBuyType(this)">
                                    <option value="0">按次收费</option>
                                    <option value="1">按时收费</option>
                                    <option value="2">日夜分次收费</option>
                                    <option value="3">不收费</option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">车辆类型</label>
                            <div class="col-md-9">
                                <%--<input type="text" class="form-control" required name="carType" placeholder="车辆类型">--%>
                                    <select class="form-control" name="carType">
                                        <option value="0">小型车</option>
                                        <option value="1">大型车</option>
                                        <option value="2">智能停车位</option>
                                    </select>
                            </div>
                        </div>
                    </div>


                    <div class="col-md-6 hide">
                        <div class="form-group">
                            <label class="control-label col-md-3">status</label>
                            <div class="col-md-9">
                                <input type="text" value="0" class="form-control" required name="status" placeholder="status">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">实行时间</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control date_hhmmss " required name="startTime" placeholder="实行时间">
                            </div>
                        </div>
                    </div>
                    <div id="free">
                    <div class="col-md-6" id="freeTime">
                        <div class="form-group">
                            <label class="control-label col-md-3">免费时长</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" required name="freeTime" placeholder="免费时长（分）">
                            </div>
                        </div>
                    </div>
                    <div id="ciType" class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">收费金额</label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" required name="payMoney" onblur="checkMoney(this.value,this)" placeholder="收费金额">
                            </div>
                        </div>
                    </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">停车场</label>
                            <div class="col-md-9">
                                <input type="hidden" id="parkName" name="parkName">
                                <select  class="form-control" required id="parkId" name="parkId" onchange="chooseParkName()">
                                    <option value="" hidden>请选择停车场</option>
                                    <c:forEach items="${parkList}" var="park">
                                        <option value="${park.id}">${park.name}</option>
                                    </c:forEach>
                                </select>
                            </div>
                        </div>
                    </div>


                    <div id="timeType"  class="hide">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="control-label col-md-3">首段收费时长</label>
                                <div class="col-md-9">
                                    <input type="text" class="form-control" required name="firstPayTime" placeholder="首段收费时长">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="control-label col-md-3">首段收费金额</label>
                                <div class="col-md-9">
                                    <input type="text" class="form-control" required name="firstPayMoney" onblur="checkMoney(this.value,this)" placeholder="首段收费金额">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="control-label col-md-3">间隔收费时长</label>
                                <div class="col-md-9">
                                    <input type="text" class="form-control" required name="intervalTime" placeholder="间隔收费时长">
                                </div>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="control-label col-md-3">间隔收费金额</label>
                                <div class="col-md-9">
                                    <input type="text" class="form-control" required name="intervalMoney" onblur="checkMoney(this.value,this)" placeholder="间隔收费金额">
                                </div>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-md-3 control-label">是否启用封顶金额</label>
                                <div class="col-md-9">
                                    <div class="md-radio-inline">
                                        <div class="md-radio">
                                            <input type="radio" id="checkbox2_9" name="maxStatus" onclick="chooseMaxMoney(this)" class="md-radiobtn" value="1">
                                            <label for="checkbox2_9">
                                                <span class="inc"></span>
                                                <span class="check"></span>
                                                <span class="box"></span> 启用
                                            </label>
                                        </div>
                                        <div class="md-radio" >
                                            <input type="radio" id="checkbox2_8" name="maxStatus" class="md-radiobtn" value="0" onclick="chooseMaxMoney(this)" checked>
                                            <label for="checkbox2_8">
                                                <span class="inc"></span>
                                                <span class="check"></span>
                                                <span class="box"></span> 关闭
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-6 hide" id="maxMoney" >
                            <div class="form-group">
                                <label class="control-label col-md-3">封顶金额</label>
                                <div class="col-md-9">
                                    <input type="text" class="form-control" name="maxMoney" required onblur="checkMoney(this.value,this)" placeholder="封顶金额">
                                </div>
                            </div>
                        </div>
                    </div>

                    <div id="nightType" class="hide">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="control-label col-md-3">晚上开始时间</label>
                                <div class="col-md-9">
                                    <input type="text" class="form-control date_hhmmss " required name="nightStartTime" placeholder="晚上开始时间">
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="form-actions">
                <div class="row">
                    <div class="col-md-6">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <button type="button" class="btn green" onclick="save();">保存收费规则</button>
                                <button type="button" class="btn default" onclick="layer.close(layer_addModule);">取消</button>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6"> </div>
                </div>
            </div>
        </form>
        <!-- END FORM-->
    </div>
</div>
<!-- script 开始 -->


<script>

    $(function(){
        //初始化页面
        initPage();
        $('.date_hhmmss').prop("readonly", true).timepicker({
            timeText: '时间',
            hourText: '小时',
            minuteText: '分钟',
            secondText: '秒',
            currentText: '现在',
            closeText: '完成',
            showSecond: true, //显示秒
            timeFormat: 'HH:mm:ss' //格式化时间
        });
    });

    function chooseParkName() {
        var name=$("#parkId option:selected").text();
        $("#parkName").val(name)
    }


    function checkMoney(money,obj) {
        var rex=/^\d{1,6}(\.\d{1,2})?$/;
        if(!rex.test(money)){
            $(obj).val("");
        }
    }
    /**
     * 保存收费规则
     */
    function save(){
        var param = tools.formParams("save-module");
        console.log(param);
        if(tools.valid("save-module")){
            tools.post("/chargeRules/save",param,function(data){
                if(data.success){
                    layer.msg('收费规则保存成功', {icon: 1,time:1000},function(){
                        //刷新列表页面
                        toPage(null);
                        //关闭弹窗
                        layer.close(layer_addModule);
                    });
                }else{
                    tools.errorTip(data.code,data.message);
                }
            });
        }
    }


    function chooseBuyType(obj) {
        var payType = $(obj).find("option:selected").val();
        if (payType==0){//按次
            $("#free").removeClass("hide");
            $("#ciType").removeClass("hide");
            $("#ciType label").text("收费金额");
            $("#timeType").addClass("hide");
            $("#nightType").addClass("hide");
        }else if(payType==1){//按时
            $("#free").removeClass("hide");
            $("#ciType").addClass("hide");
            $("#timeType").removeClass("hide");
            $("#nightType").addClass("hide");
        }else if(payType==2){//日夜分次
            $("#free").removeClass("hide");
            $("#ciType").removeClass("hide");
            $("#ciType label").text("晚上收费金额");
            $("#timeType").removeClass("hide");
            $("#nightType").removeClass("hide");
        }else { //不收费
            $("#free").addClass("hide");
            $("#timeType").addClass("hide");
            $("#nightType").addClass("hide");
        }
    }

    function chooseMaxMoney(){

        var status = $('input[type="radio"]:checked').val();
        if (status==0){//关闭
            $("#maxMoney").addClass("hide");
            $("#maxMoney").val("")
            console.log(status)
        }else {
            $("#maxMoney").removeClass("hide");
            console.log(status)
        }
    }



</script>
<!-- script 结束 -->